<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<div th:replace="common/common::html"></div>
<head>
    <meta charset="UTF-8">
    <title th:text="#{login.title}"></title>
    <script th:inline="javascript">
        $(function () {
            $("#login-submit-btn").click(function (event) {
                event.stopPropagation();
                var flag = $("#login-form-id input.form-control").verification({});
                if(!flag){
                    return;
                }
                // console.info(obj);
                $("#login-form-id").submit()
                // message("登录成功")


            })
        });
    </script>
</head>
<body style="display: flex;flex-direction: column">
<div style="flex-basis: 100px;display: flex;flex-direction: row">
    <div style="flex-grow: 1;">
        <img th:if="${session.siteLanguage} eq 'en'" th:src="@{/assets/images/logo_en.png}">
        <img th:if="${session.siteLanguage} ne 'en'" th:src="@{/assets/images/logo_zh.png}">

    </div>
    <div style="flex-basis: 100px;margin-top: 26px;">
        <a th:href="@{login(siteLanguage=zh)}" th:text="#{login.chinese}"></a>
        <a th:href="@{login(siteLanguage=en)}" th:text="#{login.english}"></a>
    </div>
</div>
<div style="flex-grow: 1;display: flex;flex-direction: row">
    <img style="flex-grow: 1;" th:src="@{/assets/images/pic.png}">
    <div style="flex-basis: 320px;display: flex;flex-direction: column;margin-right: 20px;">
        <div style="flex-grow: 1;"></div>
        <div  style="flex-basis: 300px">
            <form id="login-form-id" th:action="@{verification}" method="post">
                <div class="form-group">
                    <span th:text="#{login.user.name}"></span>
                    <input class="form-control" type="text" name="username" reg="^.{1,20}$">
                </div>
                <div class="form-group">
                    <span th:text="#{login.user.passwd}"></span>
                    <input class="form-control" type="password" name="password" reg="^.{1,20}$">
                </div>
                <div class="form-group">
                    <!--                        <button type="submit" th:text="#{login.user.btn}"></button>-->
                    <a id="login-submit-btn" class="form-control btn-success" href="#" th:text="#{login.user.btn}" style="text-align: center"></a>
                </div>

            </form>
        </div>

        <div style="flex-grow: 2;"></div>
    </div>

</div>




</body>
</html>